<template>
  <el-row :gutter="20">
    <el-col :span="4">
      <side-bar :tabs-data="sideBarData" @sideTabClick="sideTabClick"></side-bar>
    </el-col>
    <el-col :span="16">
      <h1>博客页</h1>
      <keep-alive>
        <router-view></router-view>
      </keep-alive>
    </el-col>
  </el-row>
</template>

<script>
import SideBar from "@/views/blog/childComps/SideBar";
export default {
  name: "Blog",
  components:{
    SideBar
  },
  data(){
    return{
      sideBarData: [
        {
          moduleName: "所有博客",
          path: "/blog/articles"
        },
        {
          moduleName: "写博客",
          path: "/blog/article_edit"
        },
      ]
    }
  },
  methods: {
    sideTabClick(tabIndex){
      this.$router.push(this.sideBarData[tabIndex].path);
    }
  }
}
</script>

<style scoped>

</style>
